/**
 * desc：  LoginByPhoneNumberNext
 * author：frandy
 * date：  2020/3/31 2:53 下午
 */
import React, {PureComponent} from 'react';
import {View, TextInput, StatusBar, ActivityIndicator} from 'react-native';
import {Toast} from 'teaset'
import {LoginByPhoneNumberSty} from './theme'
import {Button, Loading} from "../../components";
import {color, request} from "../../utils";
import * as userActions from '../../actions/userAction'
import {connect} from "react-redux";

@connect(state => ({userState: state.userReducer}))
export default class LoginByPhoneNumberNext extends PureComponent {

    static defaultProps = {};

    static propTypes = {};

    constructor(props) {
        super(props);
        this.state = {
            password: ''
        }
    }

    componentDidMount(): void {

    }

    toLogin = async () => {

        const {password} = this.state
        const {params: {phone}} = this.props.route
        this.props.dispatch(userActions.login({phone, password}))
    }


    render() {
        const {password} = this.state;
        let {loginStart} = this.props.userState
        return (
            <View>
                <StatusBar translucent backgroundColor='rgba(0,0,0,0)' barStyle="dark-content"/>
                {loginStart && <Loading/>}
                <View style={LoginByPhoneNumberSty.inputPhone}>
                    <TextInput
                        maxLength={20}
                        style={LoginByPhoneNumberSty.phoneSty}
                        placeholder={'输入密码'}
                        autoFocus
                        onChangeText={password => this.setState({
                            password
                        })}
                        secureTextEntry
                        returnKeyType={'done'}
                        returnKeyLabel={'登录'}
                        onSubmitEditing={() => this.toLogin()}
                        underlineColorAndroid={'transparent'}
                    />
                </View>
                <Button
                    btStyle={{
                        backgroundColor: password.length ? color.theme : 'rgb(255,185,185)',
                        width: '90%',
                        marginTop: 40
                    }}
                    disabled={!password.length}
                    titleStyle={LoginByPhoneNumberSty.titleSty}
                    onPress={() => this.toLogin()}
                    title={'立即登录'}
                />
            </View>
        );
    }
}
